
:root{
  --peak-accent:#03b1ea;
  --peak-dark:#0b0b0b;
  --peak-card:#121212;
  --peak-text:#eaeaea;
}
.header-logo-bar{background:var(--peak-dark); padding:10px 0;}
.header-inner{max-width:1200px; margin:0 auto; display:flex; align-items:center; gap:18px; padding:0 15px;}
.brand img{height:72px; width:auto; display:block;}
.top-nav{margin-left:auto; display:flex; flex-wrap:wrap; gap:18px;}
.top-nav .nav-link{color:#fff; text-decoration:none; opacity:.9}
.top-nav .nav-link:hover{opacity:1; text-decoration:none; color:#fff;}
.top-nav .nav-link.active{color:var(--peak-accent); opacity:1;}
.header-cta{margin-left:12px;}
.hero.hero-dark{background:linear-gradient(135deg, #000 0%, #111 55%, #001e27 100%); color:#fff; padding:54px 0;}
.hero .lead{max-width:860px; opacity:.9}
.hero-cta{margin-top:18px; display:flex; gap:10px; flex-wrap:wrap;}
.btn-primary{background:var(--peak-accent); border-color:var(--peak-accent);}
.btn-outline-light{border:1px solid rgba(255,255,255,.55); color:#fff; background:transparent;}
.btn-outline-light:hover{background:rgba(255,255,255,.08); color:#fff;}
.page-main{padding:34px 0;}
.section-title{margin:22px 0 10px;}
.service-grid{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; margin:18px 0 10px;}
@media(min-width:768px){.service-grid{grid-template-columns:repeat(4, minmax(0,1fr));}}
.service-btn{
  background:#0f0f0f;
  border:1px solid rgba(255,255,255,.10);
  color:#fff;
  padding:16px 14px;
  border-radius:14px;
  text-decoration:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  box-shadow:0 10px 24px rgba(0,0,0,.25);
}
.service-btn:hover{border-color:rgba(3,177,234,.6); transform:translateY(-1px); text-decoration:none; color:#fff;}
.service-btn .label{font-weight:700; letter-spacing:.2px;}
.service-btn .meta{font-size:12px; opacity:.75}
.service-btn .chev{width:10px; height:10px; border-right:2px solid var(--peak-accent); border-bottom:2px solid var(--peak-accent); transform:rotate(-45deg);}
.info-cards{display:grid; grid-template-columns:1fr; gap:12px; margin:18px 0;}
@media(min-width:768px){.info-cards{grid-template-columns:repeat(3, 1fr);}}
.info-card{background:#f7f7f7; border:1px solid #e9e9e9; border-radius:14px; padding:16px;}
.info-card h3{margin-top:0;}
.site-footer{background:#0b0b0b; color:#d9d9d9; padding:34px 0 18px; margin-top:30px;}
.site-footer a{color:#d9d9d9; text-decoration:none;}
.site-footer a:hover{color:var(--peak-accent);}
.site-footer h4{color:#fff; margin-top:0;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.10); padding-top:12px; margin-top:18px; font-size:12px; opacity:.85;}


/* === Peak MOT aggressive tuning-style glow + socials === */
:root{
  --peak-red:#e10600;
  --peak-blue:#0066ff;
  --peak-accent:var(--peak-blue);
}

.header-cta{display:flex; align-items:center; gap:10px;}
.social-icon{
  width:38px; height:38px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:12px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.10);
  text-decoration:none;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.social-icon svg{width:18px; height:18px; fill:#fff; opacity:.95}
.social-icon.whatsapp:hover{
  border-color:rgba(225,6,0,.75);
  box-shadow:0 0 0 1px rgba(225,6,0,.35), 0 0 22px rgba(225,6,0,.60), 0 0 34px rgba(0,102,255,.40);
  transform:translateY(-2px);
}
.social-icon.instagram:hover{
  border-color:rgba(0,102,255,.75);
  box-shadow:0 0 0 1px rgba(0,102,255,.35), 0 0 22px rgba(0,102,255,.55), 0 0 34px rgba(225,6,0,.35);
  transform:translateY(-2px);
}

.service-btn{
  position:relative;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.service-btn:hover{
  border-color:rgba(0,102,255,.75);
  box-shadow:
    0 0 0 1px rgba(0,102,255,.30),
    0 0 22px rgba(225,6,0,.65),
    0 0 40px rgba(0,102,255,.55),
    0 18px 44px rgba(0,0,0,.55);
  transform:translateY(-3px);
}
.service-btn:focus{
  outline:none;
  box-shadow:
    0 0 0 2px rgba(0,102,255,.35),
    0 0 26px rgba(225,6,0,.55),
    0 0 42px rgba(0,102,255,.45);
}

/* Make primary buttons match the logo accents */
.btn.btn-primary{
  background:linear-gradient(90deg, var(--peak-red), var(--peak-blue));
  border:0;
  box-shadow:0 0 0 1px rgba(255,255,255,.06);
}
.btn.btn-primary:hover{
  box-shadow:0 0 0 1px rgba(255,255,255,.10), 0 0 22px rgba(225,6,0,.55), 0 0 34px rgba(0,102,255,.45);
}
.top-nav .nav-link.active{color:var(--peak-blue); opacity:1;}
